/*
Theme Name: Thanh gio
Theme URI: http://wordpress.org/themes/twentytwelve
Author: the WordPress team
Author URI: http://wordpress.org/
Description: The 2012 theme for WordPress is a fully responsive theme that looks great on any device. Features include a front page template with its own widgets, an optional display font, styling for post formats on both index and single views, and an optional no-sidebar page template. Make it yours with a custom menu, header image, and background.
Version: 1.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, gray, white, one-column, two-columns, right-sidebar, flexible-width, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready
Text Domain: thanhgio 

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* =Notes
--------------------------------------------------------------
This stylesheet uses rem values with a pixel fallback. The rem
values (and line heights) are calculated using two variables:

$rembase:     14;
$line-height: 24;

---------- Examples

* Use a pixel value with a rem fallback for font-size, padding, margins, etc.
        padding: 5px 0;
        padding: 0.357142857rem 0; (5 / $rembase)

* Set a font-size and then set a line-height based on the font-size
        font-size: 16px
        font-size: 1.142857143rem; (16 / $rembase)
        line-height: 1.5; ($line-height / 16)

---------- Vertical spacing

Vertical spacing between most elements should use 24px or 48px
to maintain vertical rhythm:

.my-new-div {
        margin: 24px 0;
        margin: 1.714285714rem 0; ( 24 / $rembase )
}

---------- Further reading

http://snook.ca/archives/html_and_css/font-size-with-rem
http://blog.typekit.com/2011/11/09/type-study-sizing-the-legible-letter/


/* =Reset
-------------------------------------------------------------- */


body {
    font: 12px "Helvetica Neue",Helvetica,Arial,sans-serif;
}
body {
    background: none repeat scroll 0 0 #FFFFFF;
    color: #333333;
    direction: ltr;
    line-height: 1.28;
    margin: 0;
    padding: 0;
    text-align: left;
    unicode-bidi: embed;
}


a {
    color: #333333;
    text-decoration: none;
}

.site-header {
    padding: 15px 0 0;
}

.navbar {
    overflow: visible;
}

#site-navigation:before, #site-navigation:after {
    content: "";
    display: table;
    line-height: 0;
}
#site-navigation:after {
    clear: both;
}
#site-navigation:before, #site-navigation:after {
    content: "";
    display: table;
    line-height: 0;
}
#site-navigation {
    min-width: 765px;
}
.navbar-fixed-top #site-navigation, .navbar-static-top #site-navigation {
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
}
.navbar-fixed-top #site-navigation, .navbar-fixed-bottom #site-navigation {
    border-radius: 0 0 0 0;
    padding-left: 0;
    padding-right: 0;
}
.navbar-fixed-top #site-navigation, .navbar-static-top #site-navigation {
    border-width: 0 0 1px;
}
#site-navigation {
    background: none repeat scroll 0 0 #FFFFFF;
}
#site-navigation {
    display: block;
}

li {
    line-height: 20px;
}



#site-navigation ul{
    padding-left: 20px;
    list-style: none outside none;
    display: block;
    float: left;
    left: 0;
    margin: 0 10px 0 0;
    position: relative;
}

#site-navigation div.logo{
    float: left;
    padding: 5px 25px;
    border-right: 1px solid #F2F2F2;
}

#site-navigation ul > li {
    float: left;
}

.main-navigation-left ul > li a{
    color: #151515;
    font-size: 13px;
    font-weight: bold;
    line-height: 40px;
    padding: 13px 15px;
}

.main-navigation-left ul > li > a{
    color: #151515;
    font-size: 13px;
    font-weight: bold;
    float: none;

    text-decoration: none;
    text-shadow: 0 1px 0 #FFFFFF;
}

#site-navigation ul > li > a:hover{
    color: #EE5C0D
}

.main-navigation-left ul > li.current-menu-item > a, #site-navigation ul > li.current-menu-item > a:hover{
    background-color: #E5E5E5;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.125) inset;
    color: #555555;
    text-decoration: none;
}

#like-page {
    float: left;
    margin-top: 10px;
}


#like-page .fanpage-menu {
    background: none repeat scroll 0 0 #335E9C;
    border-radius: 3px 3px 3px 3px;
    box-shadow: 0 1px 1px #333333;
    color: #FFFFFF;
    float: left;
    line-height: 16px;
    margin-right: 5px;
    padding: 2px 7px;
    font-size: 13px;
}


.fb_edge_widget_with_comment {
    position: relative;
}
.fb_iframe_widget {
    display: inline-block;
    position: relative;
}


#site-navigation .nav.pull-right {
    display: block;
    left: 0;
    position: relative;
    float: right;
    margin-right: 0;
    border-left: 1px solid #F2F2F2;
}

#site-navigation .nav.pull-right > li {
    float: left;
    display: block;
}

.posted {
    bottom: 2px;
    line-height: 24px;
    padding: 10px 15px 2px !important;
    position: relative;
}

.nav.pull-right > li a{
    color: #777777;
    float: none;
    padding: 10px 15px;
    text-decoration: none;
    text-shadow: 0 1px 0 #FFFFFF;
    display: block;
}


.nav.pull-right > li a .cunach-icon {
    background-image: url("img/cunach-icon.png");
    background-position: -81px -121px;
    bottom: 6px;
    display: inline-block;
    height: 30px;
    position: relative;
    text-indent: -999999px;
    width: 32px;
}

.nav.pull-right ul > li > a{
    color: #151515;
    font-size: 13px;
    font-weight: bold;
    float: none;
    text-decoration: none;
    text-shadow: 0 1px 0 #FFFFFF;
}

ul.nav.pull-right > li a{
    color: #151515;
    font-size: 13px;
    font-weight: bold;
    padding: 10px 15px 0;
}
